<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title></title>
<meta name="description" content="" />
<meta name="author" content="" />
<meta name="viewport" content="width=device-width,initial-scale=1" />

<!-- CSS concatenated and minified via ant build script-->
<link rel="stylesheet" href="css/style.css" />
<!-- end CSS-->

<script src="js/libs/modernizr-2.0.6.min.js"></script>

</head>

<body id="ourWork">
<div id="container">
  <header role="mainHeader">
    <div class="center-container"> <a title="Bosz Digital" href="http://www.boszdigital.com" class="logo"><img src="img/bosz_logo.png" alt="BOSZ" width="154" height="50" border="0" /></a>
      <ul class="menu-princ">
        <li><a title="Home" href="index.html">Home</a>|</li>
        <li><a title="Our team" href="our_team.html">Our team</a>|</li>
        <li class="active"><a title="Our work" href="our_work.html">Our work</a>|</li>
        <li><a id="contact" title="Contact Us" target="_blank" href="contact_info.html">Contact Us</a></li>
      </ul>
    </div>
  </header>
  <div id="main" role="main">
    <div class="main-wrapper">
      <div class="center-container">
       <h1>Our Work</h1>
       <section role="categories" id="categories">
         <article>
            <figure><img src="img/bosz_website_icon.png" width="70" height="87" alt="Website" /></figure>
            <h2>WEBSITES</h2>
            <p>From PSD to fully functional live site with excellent coding and best standards. </p>
            <a href="#" title="Websites Projects" class="generic-btn">View More</a>
         </article>
         <article>
            <figure><img src="img/bosz_email_icon.png" width="99" height="87" alt="Website" /></figure>
            <h2>EMAILS</h2>
            <p>We make our clients' emails look good, no matter where they are viewed.</p>
            <a href="#" title="Emails Projects" class="generic-btn">View More</a>
         </article>
         <article>
            <figure><img src="img/bosz_widgets_icon.png" width="88" height="87" alt="Website" /></figure>
            <h2>WIDGETS</h2>
            <p>These mini web applications enhance our clients' web presence. </p>
            <a href="#" title="Widgets Projects" class="generic-btn">View More</a>
         </article>
       </section>
       
      </div>
    </div>
    <div class="content-center closed">
      <div class="shadow-container">
      	<section id="showDetail" role="showDetail">
        <div id="contentArticle">
	      	<article id="website" class="hide">
	        	<div class="col-left">
		            <header>
		            	<h3>WEBSITE DEVELOPMENT</h3>
		            </header>
	                <p>When we develop a site we keep in mind about browser compatibility, functionality &amp; accesibility</p>
	            	<div class="sliderThumb">
	                	<div id="slider">
	                      <a href="#" title="Prev" class="prev"></a>
	                      <a href="#" title="Next" class="next"></a>
	                      <nav role="sliderTh" class="sliderTh">
	                      	<ul>
	                        	<li><a href="#sample1" title="" rel="http://www.seetheworlddigital.com/bosz/razor/ATTPROD-1-/landingpage.html"><img src="img/website_at_t-s.jpg" width="68" height="68" /></a></li>
	                            <li><a href="#sample2" title="" rel="http://www.seetheworlddigital.com/bosz/razor/bingPorfolio/home.htm"><img src="img/website_bing-s.jpg" width="68" height="68" /></a></li>
	                            <li><a href="#sample3" title="" rel="http://www.seetheworlddigital.com/bosz/razor/delta/index.php?dest=26#dest26"><img src="img/website_delta-s.jpg" width="68" height="68" /></a></li>
	
	                        </ul>
	                      </nav>
	                   
	                    </div>
	              </div>
	            </div>
	            <div class="col-right">
	            	<div id="slideImagesPr">
		                <ul>
		                  <li id="sample1" class="active"><img src="img/website_at_t-th.jpg" alt="" /></li>
		                  <li id="sample2"><img src="img/website_bing-th.jpg" alt="" /></li>
		                  <li id="sample3"><img src="img/website_delta-th.jpg" alt="" /></li>

		                </ul>
	                 </div>  	
	               
	                
	                <nav role="projectView">
	                	<ul>
	                    	<li><a href="" title="View Demo" id="viewDemo" target="_blank">View Demo</a></li>
	                        <li>|</li>
	                        <li><a href="img/sample1.jpg" title="Zoom Image" id="zoomImg" rel="projectWebsite">Zoom Image</a></li>
	                    </ul>
	                </nav>
	            </div>
	            
	            
	        </article><!-- End Article Website -->
	        <article id="emails">
	        	<div class="col-left">
		            <header>
		            	<h3>EMAILS DEVELOPMENT</h3>
		            </header>
	                <p>We make your email accessible to all email account services</p>
	            	<div class="sliderThumb">
	                	<div id="slider">
	                      <a href="#" title="Prev" class="prev"></a>
	                      <a href="#" title="Next" class="next"></a>
	                      <nav role="sliderTh" class="sliderTh">
	                      	<ul>
	                        	<li><a href="#sample1" title="" rel="http://www.seetheworlddigital.com/bosz/razor/APEX-3/external/"><img src="img/email_apex-s.jpg" width="68" height="68" /></a></li>
	                            <li><a href="#sample2" title="" rel="http://www.seetheworlddigital.com/bosz/razor/bob/"><img src="img/email_bob-s.jpg" width="68" height="68" /></a></li>
	                            <li><a href="#sample3" title="" rel="http://www.seetheworlddigital.com/bosz/razor/E1_EFX401_2011_CoPay_REFILL_REMINDER_E1/E1_EFX401_2011_CoPay_REFILL_REMINDER_E1.html"><img src="img/email_effexor-s.jpg" width="68" height="68" /></a></li>
	                            <li><a href="#sample4" title="" rel="http://www.seetheworlddigital.com/bosz/razor/HSBC-1/assignment2/email1/index.html"><img src="img/email_hsbc-s.jpg" width="68" height="68" /></a></li>
	                            <li><a href="#sample5" title="" rel="http://www.seetheworlddigital.com/bosz/razor/INTELCP-1/index_spa.html"><img src="img/email_intel-s.jpg" width="68" height="68" /></a></li>
                                <li><a href="#sample6" title="" rel="http://www.seetheworlddigital.com/bosz/razor/PfizerPro/"><img src="img/email_pfizer-s.jpg" width="68" height="68" /></a></li>
	                        </ul>
	                      </nav>
	                   
	                    </div>
	              </div>
	            </div>
	            <div class="col-right">
	            	<div id="slideImagesPr">
		                <ul>
		                  <li id="sample1" class="active"><img src="img/email_apex-th.jpg" alt="" /></li>
		                  <li id="sample2"><img src="img/email_bob-th.jpg" alt="" /></li>
		                  <li id="sample3"><img src="img/email_effexor-th.jpg" alt="" /></li>
		                  <li id="sample4"><img src="img/email_hsbc-th.jpg" alt="" /></li>
		                  <li id="sample5"><img src="img/email_intel-th.jpg" alt="" /></li>
                          <li id="sample6"><img src="img/email_pfizer-th.jpg" alt="" /></li>
		                </ul>
	                 </div>  	
	               
	                
	                <nav role="projectView">
	                	<ul>
	                    	<li><a href="" title="View Demo" id="viewDemo" target="_blank">View Demo</a></li>
	                        <li>|</li>
	                        <li><a href="img/sample1.jpg" title="Zoom Image" id="zoomImg" rel="projectEmails">Zoom Image</a></li>
	                    </ul>
	                </nav>
	            </div>
	            
	            
	        </article><!-- End Article Emails -->
	        <article id="widgets">
	        	<div class="col-left">
		            <header>
		            	<h3>WIDGETS DEVELOPMENT</h3>
		            </header>
	                <p>When we develop a widget we keep in mind about functionality, performance, usability &amp; accessibility</p>
	            	<div class="sliderThumb">
	                	<div id="slider">
	                      <a href="#" title="Prev" class="prev"></a>
	                      <a href="#" title="Next" class="next"></a>
	                      <nav role="sliderTh" class="sliderTh">
	                      	<ul>
	                        	<li><a href="#sample1" title="" rel="http://www.seetheworlddigital.com/bosz/razor/bitk/bitk-public_300x250.html"><img src="img/widgets_freeScore1-s.jpg" width="68" height="68" /></a></li>
	                            <li><a href="#sample2" title="" rel="http://www.seetheworlddigital.com/bosz/razor/college/300/ct-public_300x250.html"><img src="img/widgets_freeScore4-s.jpg" width="68" height="68" /></a></li>
	    
	                        </ul>
	                      </nav>
	                   
	                    </div>
	              </div>
	            </div>
	            <div class="col-right">
	            	<div id="slideImagesPr">
		                <ul>
		                  <li id="sample1" class="active"><img src="img/widgets_freeScore1-th.jpg" alt="" /></li>
		                  <li id="sample2"><img src="img/widgets_freeScore4-th.jpg" alt="" /></li>

		                </ul>
	                 </div>  	
	               
	                
	                <nav role="projectView">
	                	<ul>
	                    	<li><a href="" title="View Demo" id="viewDemo" target="_blank">View Demo</a></li>
	                        <li>|</li>
	                        <li><a href="img/sample1.jpg" title="Zoom Image" id="zoomImg" rel="projectWidgets">Zoom Image</a></li>
	                    </ul>
	                </nav>
	            </div>
	            
	            
	        </article><!-- End Article widgets -->
        </div>
      </section>
      </div>
      
    </div>
  </div>
  <footer>
    <div class="shadow-container"> <img class="logo_footer" src="img/bosz_logo_footer.png" alt="BOSZ" border="0" />
      <p>&copy; Copyright Bosz Digital 2011. A Company from <a target="_blank" title="The Tribu Group" href="http://www.grupotribu.com/#/group/companies"><strong>The Tribu Group.</strong></a></p>
      <ul class="footer-menu">
        <li><a title="Home" href="/">Home</a>|</li>
        <li><a title="Our team" href="our_team.html">Our team</a>|</li>
        <li class="active"><a title="Our work" href="our_work.html">Our work</a>|</li>
        <li><a title="Contact Us" href="#">Contact Us</a></li>
      </ul>
    </div>
  </footer>
</div>
<!--! end of #container --> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.6.2.min.js"><\/script>')</script> 

<!-- scripts concatenated and minified via ant build script--> 
<script defer src="js/plugins.js"></script>
<script defer src="js/script.js"></script> 
<!-- end scripts--> 

<script> // Change UA-XXXXX-X to be your site's ID
    window._gaq = [['_setAccount','UAXXXXXXXX1'],['_trackPageview'],['_trackPageLoadTime']];
    Modernizr.load({
      load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
    });
  </script> 

<!--[if lt IE 7 ]>
    <script src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script>
    <script>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script>
  <![endif]-->

</body>
</html>